<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" href="../../css/api.css">
    <style>
    	header:not(:empty){ display: none; position: relative; background-color: #f3d41d; border-bottom: 1px solid #c9c9c9; line-height: 43px; text-align: center; color: #212121; font-size: 16px; }
    	header [class*=ic-back]{ padding-left: 21px; padding-right: 28px; line-height: 49px;}
    	header .no-arrow{ padding-left: 21px; padding-right: 28px; float: left;}
    	header .no-icon-right{ padding-left: 28px; padding-right: 21px; float: right;}
     	header .selectWiFi{ position: absolute; left: 41%; margin-left: 0px; }
     	header .wifiNotSame{ position: absolute; left: 37%; margin-left: 0px; }
 		header [class*=ic-]:not(.ic-refresh),
    	header .left{ position: absolute; bottom: 0; background-position: 5px 60%; background-size: 18px auto; min-width: 44px; height: 44px; }
    	header .left{left: 0;   }
    	header .right{ right: 0; background-position: center 50% !important; }
    	header.deviceList .ic-refresh{ width: 18px; height: 18px; background-size: 100% auto; margin: 12px 6px; transition:all .3s; -webkit-transition:all .3s; }
    	header.deviceList .left.opacity .ic-refresh{ transform:rotate(360deg); -webkit-transform:rotate(360deg); }
    	header.purifier>div{ position: relative; display: none; background-color: #39b47b; min-height: 43px; }
    	header.purifier{ border: 0; color: white; }
    	header.purifier .sleep{ background-color: #14b7c6;}
    	header.object{ background-color: #39b47b; color: white; border: 0; }
    	
    	footer{ display: none; background-color: white; }
    	footer.purifier .flex-con{  padding-top: 57px; color: #585858; padding-bottom: 7px; font-size: 9px; text-align: center; background-size: 39px auto; background-position: center 12px; font-size: 11px; }
    	footer.purifier .flex-con.active{ background-position: center -67px; }
    	footer.purifier .flex-con.ic-footer-off:after{ content: '关机'; }
    	footer.purifier .flex-con.ic-footer-off.active:after{ content: '开机'; }
    	footer.purifier .flex-con.ic-footer-off.active{ color: white; }
    	footer.purifier .flex-con.ic-footer-sleep.active{ color: #15aebe; }
    	footer.purifier .flex-con.ic-footer-auto.active{ color: #37ad76; }
    </style>
</head>
<body class="flex-wrap flex-vertical">
	<header class="login" >机智云账号登录</header>
	<header class="register" >
		<div tapmode="opacity" onclick="api.closeWin();" class="ic-back">返回</div>
		注册新用户
	</header>
	<header class="forgetPassword" >
		<div tapmode="opacity" onclick="api.closeWin();" class="ic-back">返回</div>
		忘记密码
	</header>
	<header class="selectType" >
		<div tapmode="opacity" onclick="api.closeWin();" class="ic-back">添加设备</div>
		模组类型选择
	</header>
	<header class="connectionStatus" >
		<div tapmode="opacity" onclick="api.closeWin();" class="ic-back">返回</div>
		确认设备处于连接状态
	</header>
	<header class="searchDevice" >
		<div tapmode="opacity" onclick="fnSearchDevice();" class="ic-back">取消</div>
		搜索并连接设备
	</header>
	<header class="searchDeviceSoftAP" >
		<div tapmode="opacity" onclick="fnSearchDevice();" class="ic-back">取消</div>
		搜索并连接设备
	</header>
	<header class="connectionDevice" >
		<div tapmode="opacity" onclick="fnAddDevice();" class="no-arrow">取消</div>
		<div class="wifiNotSame">手动连接设备</div>
	</header>
	<header class="connectionDeviceNext" >
		<div tapmode="opacity" onclick="api.closeWin();" class="ic-back">返回</div>
		配置设备
	</header>
	<header class="configCheckPassword">
		<div tapmode="opacity" onclick="fnCancelDevice();" class="ic-back-auto"></div>
		检查密码
	</header>
	<header class="configConnectionFailed">
		<div tapmode="opacity" onclick="api.closeToWin({name: 'win_deviceList'});" class="no-arrow">取消</div>
		<div class="wifiNotSame">连接不成功</div>
	</header>
	<header class="configSoftAPNotSame">
		<div tapmode="opacity" onclick="api.closeToWin({name: 'win_deviceList'});" class="no-arrow">取消</div>
		<div class="wifiNotSame">Wi-Fi不一致</div>
	</header>
	<header class="deviceList" >
		<div tapmode="opacity" onclick="fnGetListInfo();" class="left">
			<div class="ic-refresh"></div>
		</div>
		<div tapmode="opacity" onclick="fnActionSheet();" class="ic-more right"></div>
		我的设备
	</header>
	<header class="deviceSeting" >
		<div tapmode="opacity" onclick="api.closeWin();" class="ic-back">我的设备</div>
		设置
	</header>
	<header class="selectWiFi" >
		<div tapmode="opacity" onclick="fnAddDevice();" class="no-arrow">取消</div>
		<div tapmode="opacity" onclick="fnCustomConfig();" class="no-icon-right">手动配置</div>
		<div class="selectWiFi">添加设备</div>
	</header>
	<header class="FNScanner" ></header>
	<header class="about" >
		<div tapmode="opacity" onclick="api.closeWin();" class="ic-back">返回</div>
		关于
	</header>
	<!-- <header class="control" >
		<div tapmode="opacity" onclick="fnCancelDevice();" class="ic-back-auto"></div>
		<div class="controlTitle">控制设备</div>
	</header> -->
	<header class="deviceControl" >
		<div tapmode="opacity" onclick="fnCancelDevice();" class="ic-back"></div>
		<div tapmode="opacity" onclick="fnDeviceControlMore();" class="ic-more right"></div>
		<div class="controlTitle">控制设备</div>
	</header>
	<header class="selectedLEDColor" >
		<div tapmode="opacity" onclick="api.closeWin();" class="ic-back"></div>
		设定LED组合颜色
	</header>
	<div class="flex-con main"></div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/base.js"></script>
<script type="text/javascript">	
	var eHeader = null,
		eFooter = null;
	apiready = function(){
		eHeader = $api.dom( 'header.' + api.pageParam.name ),
		eFooter = $api.dom( 'footer.' + api.pageParam.name );
		// alert(JSON.stringify(api.pageParam));
		$api.addCls( eHeader, 'show' );
		if( eFooter )$api.addCls( eFooter, 'show' );
		if( eHeader.querySelectorAll( '.sub-header' ).length <= 0 )$api.fixStatusBar( eHeader );
			
		switch( api.pageParam.name ){
			case 'FNScanner': fnFNScanner()
				break;
			default:
				y = eHeader.offsetHeight;
				 // alert(JSON.stringify(api.pageParam.name)+11);
				$api.setStorage('pageY', y );
				api.openFrame({
				    name: 'frm_'+api.pageParam.name,
				    url: api.wgtRootDir+'/html'+api.pageParam.path+'/'+api.pageParam.name+'.html',
				    rect: {
				        x: 0,
				        y: eHeader.offsetHeight,
				        h: api.winHeight - eHeader.offsetHeight
				    },
				    bgColor: api.pageParam.bg || 'rgba(0,0,0,0)',
				    pageParam: api.pageParam
				});
		}
		api.addEventListener({
		    name: 'keyback'
		}, function(ret, err){        
		    if( ret ){
		    	switch( api.winName ){
		    		case 'win_login':
			    		api.closeWidget({
						    id: api.appId
						});
						break;
		    		case 'win_deviceList':
			    		api.closeWidget({
						    id: api.appId
						});
						break;
		    		case 'win_searchDevice' : fnSearchDevice();
		    			break;
		    		case 'win_connectionDevice' : fnConnectionDevice();
		    			break;
	    			default:
	    				fnHasBack();
		    	};
		    }
		});
	}

	function fnSearchDevice(){
    	if( localStorage.getItem( 'searchDevice' ) ){
    		if ( api.systemType === 'ios' ) {
				api.confirm({
			    	title: '提示',
			    	msg: '确定要放弃配置吗？',
			   	 	buttons: ['不了', '确定']
				}, function(ret, err){
					if( ret.buttonIndex === 2 ){
						localStorage.setItem( 'hasConfigure', api.winName );
						localStorage.removeItem( 'searchDevice' );
    					api.closeToWin({
    				    name: 'win_deviceList'
    					});
					}
				});
			}
			else{
				api.confirm({
			    	title: '提示',
			    	msg: '确定要放弃配置吗？',
			   	 	buttons: ['确定', '不了']
				}, function(ret, err){
					if( ret.buttonIndex === 1 ){
						localStorage.setItem( 'hasConfigure', api.winName );
						localStorage.removeItem( 'searchDevice' );
    					api.closeToWin({name: 'win_deviceList'});
					}
				});
			}
    	}else{
        	api.closeWin();
        }
    }

    function fnAddDevice(){
		if ( api.systemType === 'ios' ) {
			api.confirm({
		    	title: '提示',
		    	msg: '是否退出配置？',
		   	 	buttons: ['不了', '确定']
			}, function(ret, err){
				if( ret.buttonIndex === 2 ){
					api.closeToWin({name: 'win_deviceList'});
				}
			});
		}
		else{
			api.confirm({
		    	title: '提示',
		    	msg: '是否退出配置？',
		   	 	buttons: ['确定', '不了']
			}, function(ret, err){
				if( ret.buttonIndex === 1 ){
					api.closeToWin({name: 'win_deviceList'});
				}
			});
		}		
	}

	function fnCancelDevice(){
		// api.execScript({
		//     name: 'win_control',
		//     frameName: 'frm_control',
		//     script: 'fnUnsubscribe();'
		// });
		api.execScript({
		    name: 'win_deviceControl',
		    frameName: 'frm_deviceControl',
		    script: 'fnUnsubscribe();'
		});
		api.closeWin();
	}

	function fnGetListInfo(){
		api.execScript({
		    name: 'win_deviceList',
			frameName: 'frm_deviceList',
		    script: 'fnGetBoundDevices()'
		});
	}

	function fnActionSheet(){
		api.getPrefs({
		    key:'user'
		}, function(ret, err){
			if( ret.value ){
				var urserName = JSON.parse( ret.value ).userName;
				var myuser = JSON.parse( ret.value ).myuser;
			
				if( urserName | myuser ){
					var buttons = ['扫码绑定设备','添加设备','设置', '注销' ];
				}else {
					var buttons = ['扫码绑定设备','添加设备','设置', '登录' ];
				}
				
				
				api.actionSheet({
				    cancelTitle: '取消',
				    buttons: buttons
				}, function(ret, err){
					if( ret.buttonIndex === 1 ){
						fnJumpWin({name: 'FNScanner'})
					}else if( ret.buttonIndex === 2 ){
						fnJumpWin({name: 'selectWiFi', path: '/main'});
					}else if( ret.buttonIndex === 3 ){
						fnJumpWin({name: 'deviceSeting', path: '/user'});
					}else if( ret.buttonIndex === 4 ){
						if( buttons.indexOf( '登录' ) === -1 ){
							if ( api.systemType === 'ios') {			
								api.confirm({
							    	title: '提示',
							    	msg: '确定要退出账号吗？',
							    	buttons: ['不了', '确定']
								}, function(ret, err){
									if( ret.buttonIndex === 2 ){
										api.execScript({
									    	name: 'win_login',
									    	frameName: 'frm_login',
									    	script: 'fnEmpty({userName: "", password: ""})'
										});
										api.removePrefs({
									    	key: 'user'
										});
										api.closeWin();
									}
								});
							}
							else{
								api.confirm({
							    	title: '提示',
							    	msg: '确定要退出账号吗？',
							    	buttons: ['确定', '不了']
								}, function(ret, err){
									if( ret.buttonIndex === 1 ){
										api.execScript({
									    	name: 'win_login',
									    	frameName: 'frm_login',
									 //   	script: 'fnEmpty({userName: "", password: ""})'
										});
										api.removePrefs({
									    	key: 'user'
										});
										api.closeWin();
									}
								});
							}
						}else{
							api.closeWin();
						}
							
					}
				});
			}
		});
	}

	function fnCustomConfig() {
		api.execScript({
		    name: 'win_selectWiFi',
			frameName: 'frm_selectWiFi',
		    script: 'fnCustomConfig()'
		});
	}

	function fnSetNavigationTitle(obj) {
		var header = $api.dom(obj.name);
		header.innerHTML = obj.value;
	}

	function fnFNScanner(){
		var fNScanner=api.require('FNScanner');
		fNScanner.openView({
//			    autorotation: true
		}, function(ret, err){    
			//alert(JSON.stringify(ret));    
		    if( ret ){
		    	//alert(JSON.stringify(ret));   
		        if( ret.eventType === 'show' ){
		        	setTimeout(function(){
						api.openFrame({
						    name: 'frm_FNScanner',
						    url: api.wgtRootDir+'/html/public/FNScanner.html'
						})
		        	},300);
		        }
		        else if( ret.eventType === 'success' ){
		        	// alert("content = " + JSON.stringify(ret.content));
		        	if( ret.content.indexOf("product_key") > 0 ){
			        	var vTemp = {};
			        	var b = ret.content.split( '?' )[1].split( '&' );
			        	for( var x in b ){
							vTemp[ b[x].split( '=' )[0] ] = b[x].split( '=' )[1]
						}
						if( vTemp.product_key && vTemp.did && vTemp.passcode ){
							api.execScript({
		    					name: 'win_deviceList',
								frameName: 'frm_deviceList',
							    script: 'fnBindDevice('+JSON.stringify({
									winName: api.winName,
									frameName: api.frameName,
									data: vTemp
								})+')'
							});
							api.closeWin();
						}
					} else {
						api.execScript({
		    				name: 'win_deviceList',
							frameName: 'frm_deviceList',
							    script: 'fnBindDeviceByQRCode('+JSON.stringify({
							    winName: api.winName,
							    frameName: api.frameName,
							    data: ret.content
							})+')'
						});
						api.closeWin();
					}
		        }else if(ret.eventType=='fail'){
		        	//alert(2);
        			api.execScript({
						name : 'win_deviceList',
						frameName : 'frm_deviceList',
                	    script: 'fnScannerfailed();'
                	}); 
                	api.closeWin();		        	
		        }	
		    }else{
		        alert( JSON.stringify( err ) );
		    }
		});
	}

	function fnConnectionDevice() {
		api.closeToWin({
		    name: 'win_deviceList'
		});
	}

	function fnHasBack(){
		var hasBack = $api.getStorage( 'hasBack' );
        if( hasBack ){
        	if ( api.systemType === 'ios' ) {
        		api.confirm({
			   		title: '提示',
			   	 	msg: hasBack.msg,
					buttons: ['不了', '确定']
				}, function(ret, err){
					if( ret.buttonIndex === 2 ){
						$api.rmStorage( 'hasBack' );
						api.closeWin();
					}
				});
        	}
        	else{
        		api.confirm({
			   		title: '提示',
			   	 	msg: hasBack.msg,
					buttons: ['确定', '不了']
				}, function(ret, err){
					if( ret.buttonIndex === 1 ){
						$api.rmStorage( 'hasBack' );
						api.closeWin();
					}
				});       		
        	}
        }else{
			api.closeWin();
        }
	}

	function fnDeviceControlMore(){
		api.execScript({
							name : 'win_deviceControl',
							frameName : 'frm_deviceControl',
	                	    script: 'moreBtnDidClick();'
	                	}); 
	}
</script>
</html>